@import '../../../scss/mixin';
@import '../../../scss/variable';


.mine {
    @include wh(100%, 100%);
    background: #f7f7f8;

    .info {
        background: rgb(202, 177, 124);
        padding: 70px 40px;
        @include flex(row, flex-start, center);

        .left {
            @include wh(160px, 160px);
            border-radius: 50%;
            background: #eee;
            position: relative;
            // background-repeat: no-repeat;
            // background-position: 50% 50%;
            img{
                @include wh(100%, 100%);
                border-radius: 50%;
            }
            input {
                position: absolute;
                top: 42%;
                left: 7%;
                opacity: 0;
            }
        }

        .right {
            padding: 20px;

            p {
                color: #fff;
                line-height: 60px;
                margin-bottom: 0 !important;
            }
        }
    }

    .handle {
        @include flex(row, center, center, wrap);
        background: #fff;

        .item {
            @include wh(33.3%, 250px);
            border: .5px solid #dcdcdc;
            text-align: center;
            color: gray;
            p {
                &:nth-child(1) {
                    padding: 80px 0 20px;
                    i{
                        font-size: .6rem;
                    }
                }
            }

            &.active {
                color: rgb(33, 150, 243);
            }
        }
    }

    .quit {
        @include wh(100%, 100px);
        background: #fff;
        margin: 20px 0;
        text-align: center;
        line-height: 100px;
        color: #000;
    }
}